var myChart = echarts.init(document.getElementById('main'));
var __mapcenter__ = [116.582, 35.415];

$.getJSON('/assets/road14.json', function (linesData) {
    var data = linesData.features;
    var hStep = 300 / (data.length - 1);
    var taxiRoutes = [];
    var i = 0;
    console.log(data)
    for (var x in data) {
        var lnglats = data[x].geometry.coordinates[0]
        taxiRoutes.push({
            coords: lnglats,
            lineStyle: {
                color: echarts.color.modifyHSL('#5A94DF', Math.round(hStep * x))

            },
            value: Math.random() * 200
        })
    }

    myChart.setOption({
        maptalks3D: {
            center: __mapcenter__,
            zoom: 16,
            pitch: 55,
            urlTemplate: 'http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png',
            // altitudeScale: 1,
            postEffect: {
                enable: true,
                FXAA: {
                    enable: true
                }
            },
            light: {
                main: {
                    intensity: 1,
                    shadow: true,
                    shadowQuality: 'high'
                },
                ambient: {
                    intensity: 0.
                },
                ambientCubemap: {
                    texture: '/assets/data-1491838644249-ry33I7YTe.hdr',
                    exposure: 1,
                    diffuseIntensity: 0.5,
                    specularIntensity: 2
                }
            }
        },
        series: [
            //     {
            //     type: 'polygons3D',
            //     coordinateSystem: 'maptalks3D',
            //     // map: 'buildings',
            //     data: regionsData,
            //     shading: 'realistic',
            //     silent: true,
            //     instancing: true,
            //     realisticMaterial: {
            //         metalness: 1,
            //         roughness: 0.4,
            //         // textureTiling: 200,
            //         // detailTexture: '/asset/get/s/data-1528097075999-B13VYDfxm.jpg'
            //     }
            // },
            {
                type: 'lines3D',
                coordinateSystem: 'maptalks3D',
                effect: {
                    show: true,
                    constantSpeed: 1,
                    trailWidth: 3,
                    trailLength: 1,
                    trailOpacity: 1,
                    spotIntensity: 10
                },
                blendMode: 'lighter',
                polyline: true,
                data: taxiRoutes
            }
        ]
    });

    var maptalksIns = myChart.getModel().getComponent('maptalks3D').getMaptalks();
    maptalksIns.on('click', function (e) {
        console.log(e)
    });

});